<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>班级管理</title>
<link rel="stylesheet" href="<%=request.getContextPath()%>/common/bootstrap/css/bootstrap.min.css" type="text/css"></link>
<script type="text/javascript" src="<%=request.getContextPath()%>/common/bootstrap/js/jquery.min.js"></script>
<jsp:include page="/common/easyui.jsp"></jsp:include>
<script type="text/javascript">
	function formateDate(value, row, index) {
		var date = new Date(value);
		return date.getFullYear() + "/" + (date.getMonth() + 1) + "/"
				+ date.getDay();
	}
	function actionFunction(value,row,index){
			var e = '<a href="javascript:void(0)" onclick="editrow(this)">Edit</a> ';
			var d = '<a href="javascript:void(0)" onclick="deleterow(this)">Delete</a>';
			return e+d;
	}
	
	
	
	function getRowIndex(target){
		var tr = $(target).closest('tr.datagrid-row');
		return parseInt(tr.attr('datagrid-row-index'));
	}
	
	function editrow(target){
		var index = getRowIndex(target)
		var row = $("#tablebox").datagrid("getRows")[index];
		$("#id").remove();
		$("#clazzForm").append("<input type='text' value="+row.ID+"  id='id' name='id'/>");
		$("#subbtn").val("修改");
		$("#subbtn").unbind("click");
		$("#subbtn").bind("click",edit);
		$("#clazzForm").form("load",{
			SECONDNAME:row.SECONDNAME,
			FIRSTNAME:row.FIRSTNAME,
			name:row.NAME,
			firstteacheerid:row.FIRSTTEACHEERID,
			secondteacheerid:row.SECONDTEACHEERID,
			leavedate:formateDate(row.LEVEADATE)
			
		});
	}
	
	function edit(){
		$.ajax({
				type:"post",
				url:"<%=request.getContextPath()%>/sys/updateClazz.do",
				data:$("#clazzForm").serialize(),
				success:function(){
					alert("修改成功");
					$("#tablebox").datagrid("reload");
					$('#clazzForm').form('clear');
					$("#id").remove();
					$("#subbtn").val("Save");
					$("#subbtn").bind("click",save);
				}
			}); 
	}
	
	function save(){
	 	 $.ajax({
			type:"post",
			url:"<%=request.getContextPath()%>/sys/addClazz.do",
			data:$("#clazzForm").serialize(),
			success:function(){
				alert("添加成功");
				$('#clazzForm').form('clear');
				$("#tablebox").datagrid("reload");
			}
		}); 
	}
	
	function deleterow(target){
		$.messager.confirm('Confirm','Are you sure?',function(r){
			if (r){
				$('#tablebox').datagrid('deleteRow', getRowIndex(target));
			}
		});
	}
	
	$(function(){
		$("#subbtn").bind("click",save);
	});
	
</script>
</head>
</head>
<body>
	<div style="width: auto;height: auto;">
		<div>
				<h3>班级管理   <i class="glyphicon glyphicon-user"></i></h3>
				 
			 <div style="width: auto;height: auto;">
		
				<div style="width: 50%;height: 100%;float: left">
					<table class="easyui-datagrid" id="tablebox" title="邮箱列表"
		data-options="url:'<%=request.getContextPath()%>/sys/getClazzList.do',fitColumns:true,singleSelect:true,pagination:true,pageSize:7,pageList:[5,6,7],rownumbers:true,sortOrder:'desc',sortName:'leavedate'">
		<thead>
			<tr>
				<th
					data-options="field:'NAME',width:100,sortable:true,order:'asc'">班级名称</th>
				<th
					data-options="field:'FIRSTNAME',width:100,sortable:true,order:'asc'">讲师</th>
				<th
					data-options="field:'SECONDNAME',width:100,sortable:true,order:'asc'">班主任</th>
				<th	data-options="field:'LEAVEDATE',width:100,formatter:formateDate,sortable:true,order:'asc'">离校时间</th>
				<th	data-options="field:'action',width:100,	formatter:actionFunction">离校时间</th>
			</tr>
		</thead>
	</table>
	
				</div>
				<div style="width: 50%;height: 100%;float: right">
				<form method="post" id="clazzForm">
		<table class="table">
			<tr>
				<td>讲师：</td>
				<td><input type="hidden" name="firstteacheerid" id="firstId" /> <input
					class="easyui-textbox" id="firstName" name="FIRSTNAME"
					data-options="editable:false,prompt:'请点击图标',icons: [{iconCls:'icon-search',handler: getFirstTree}]">
					</td>
			</tr>
			<tr>

				<td>班主任：</td>
				<td><input type="hidden" name="secondteacheerid" id="SecondId" /> <input
					class="easyui-textbox" id="SecondName" name="SECONDNAME"
					data-options="editable:false,prompt:'请点击图标',icons: [{iconCls:'icon-search',handler: getSecondTree}]">
				</td>
			</tr>
			<tr>
				<td>班级：</td>
				<td>
					<input type="text" name="name"/>
				</td>
			</tr>
			<tr>
			<td>离开时间：</td>
			<td><input  type="text" class="easyui-datebox" required="required" name="leavedate"></input> </td>
			</tr>
			<tr>
				<td colspan="2"> <input type="button"  id="subbtn" class="btn btn-primary" value="保存"/></td>
			</tr>
		</table>
		</form>
				
				</div>
			</div>
		</div>
	</div>

	

	
		<dir id="treebox"></dir>
		
</body>
<script type="text/javascript">

	function getFirstTree() {
		$("#treebox").window({    
		    title:"选择讲师", 
		    width:500,   
		    height:800,    
		    modal:true   
		});
		$('#treebox').html('<iframe width="100%" height="100%" src="<%=request.getContextPath()%>/sys/toFirstTeachers.do">');  
	}

function setFirstTextBox(name,id){
	$("#firstName").textbox("setText",name)
	$("#firstId").val(id);
	$("#treebox").window("close");
}


function getSecondTree(){
	$("#treebox").window({    
		    title:"选择讲师", 
		    width:500,   
		    height:800,    
		    modal:true   
		});
		$('#treebox').html('<iframe width="100%" height="100%" src="<%=request.getContextPath()%>/sys/toSecondTeachers.do">');
	}

	function setSecondBox(name, id) {
		$("#SecondName").textbox("setText", name)
		$("#SecondId").val(id);
		$("#treebox").window("close");
	}
	
</script>
</html>